<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图书信息列表</title>
<head>
    <title>图书信息列表</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <link href="../../demo.css" rel="stylesheet" type="text/css" />

    <script src="../../scripts/boot.js" type="text/javascript"></script>
</head>
<body>
 <style type="text/css">
    html, body{
        margin:0;padding:0;border:0;width:100%;height:100%;overflow:hidden;
    }    
    </style>
    <h1>图书信息列表</h1>      

    <div style="width:100%;">
        <div class="mini-toolbar" style="border-bottom:0;padding:0px;">
            <table style="width:100%;">
                <tr>
                    <td style="width:100%;">
                        <a class="mini-button" iconCls="icon-add" onclick="add()">增加</a>
                        <a class="mini-button" iconCls="icon-remove" onclick="remove()">删除</a>       
                    </td>
                    <td style="white-space:nowrap;">
                        <input id="bookName" class="mini-textbox" emptyText="请输入图书名称" style="width:150px;" onenter="onKeyEnter"/>
 						<input id="bookType" class="mini-combobox" style="width:150px;" onenter="onKeyEnter" textField="text" valueFied="id" 
 						url="../../data/bookType.txt" showNullItem="true" nullItemText="请选择..." allowInput="false" emptyText="请输入图书类型"/>  
                        <a class="mini-button" onclick="search()">查询</a>
                         <a class="mini-button" onclick="clear()">清空</a>
                    </td>
                </tr>
            </table>           
        </div>
    </div>
   <div class="mini-fit" >
    <div id="datagrid1" class="mini-datagrid" style="width:100%;height:100%;" allowResize="flase"
        url="/bookinfolistaction?method=queryBookInfo"  idField="bookid" multiSelect="true" 
    >
        <div property="columns">
            <!--<div type="indexcolumn"></div>        -->
            <div type="checkcolumn" ></div>        
            <div type="indexcolumn" width="25" headerAlign="center" allowSort="true">序</div>    
            <div field="bookid" width="120" headerAlign="center" align="center" allowSort="true">图书编号</div>
            <div field="bookname" width="120" headerAlign="center" align="center" allowSort="true">图书名称</div>     
           <!--  <div field="createtime" width="100" headerAlign="center" dateFormat="yyyy-MM-dd" allowSort="true">创建日期</div>   -->  
            <div header="出版信息" headerAlign="center">
                <div property="columns">
                    <div field="publisher" width="100"  headerAlign="center" align="center" allowSort="true">出版单位</div>
                    <div field="author" width="100"  headerAlign="center" align="center" allowSort="true">作者</div>
                    <div field="booktype" width="100" renderer="onBookTypeRenderer" headerAlign="center" align="center" allowSort="true">图书类别</div>
                </div>
            </div> 
             <div field="remain" width="120" headerAlign="center" align="center" allowSort="true" renderer="onRemainRenderer">剩余数量</div>
             <div field="optionbutton" width="215" headerAlign="center" align="center" allowSort="true"renderer="onOptionButtonRenderer">操作按钮</div>                 
        </div>
    </div>
      </div>  

    <script type="text/javascript">
        mini.parse();
        //打开页面就加载booktype
        var booktype;
        getBookType();

        var grid = mini.get("datagrid1");
        grid.load();
        grid.sortBy("remain", "desc");
        //高亮渲染
        function onRemainRenderer(e){
        	var remain=e.row.remain;
        	if(remain<=2){
        		//单元格高亮
        		e.cellStyle='font-weight:bold;color:red;';
        		//行高亮
        		e.rowStyle='background-color:yellow;';
        	}
        	return remain;
        }
		//渲染操作按钮
        function onOptionButtonRenderer(e){
        	var bookid=e.row.bookid;
        	var remain=e.row.remain;
        	var string="<a class=\"mini-button\" iconCls=\"icon-edit\" onclick=\"edit('"+bookid+"')\">编辑</a>"+"&nbsp;"+"&nbsp;"+
        	"<a class=\"mini-button\" iconCls=\"icon-del\" onclick=\"remove('"+bookid+"')\">删除</a>"+"&nbsp;"+"&nbsp;"+
        	"<a class=\"mini-button\" iconCls=\"icon-borr\" onclick=\"borr('"+bookid+","+remain+"')\">借阅</a>"+"&nbsp;"+"&nbsp;"+
        	"<a class=\"mini-button\" iconCls=\"icon-detail\" onclick=\"detail('"+bookid+"')\">详情</a>";
        	return string;
        }
      //渲染图书类型
         //动态获取图书类型
      function getBookType(){
    	  $.ajax({
    		  url:"../../data/bookType.txt",
    		  success : function(text) {
    			  booktype=mini.decode(text);
    			  },
			  error : function() {}
    	  });
      }
		function onBookTypeRenderer(e) {
			for (var i = 0, l = booktype.length; i < l; i++) {
				var g = booktype[i];
				if (g.id == e.value)
					return g.text;
			}
			return "";
		}
       //打开新增子页
        function add() {
            
            mini.open({
                url: bootPATH + "../pages/bookinfo/bookinfoadd.html",
                title: "新增图书", width: 600, height: 400,
                onload: function () {
                    var iframe = this.getIFrameEl();
                    var data = { action: "new"};
                   // iframe.contentWindow.SetData(data);
                },
                ondestroy: function (action) {

                    grid.reload();
                }
            });
        }
      //打开编辑子页
		function edit(bookid) {
			mini.open({
				url : bootPATH+ "../pages/bookinfo/bookinfoedit.html",
				title : "编辑图书",
				width : 600,
				height : 400,
				onload : function() {
					var iframe = this.getIFrameEl();
					var data = {bookid : bookid};
				iframe.contentWindow.SetData(data);
				},
				ondestroy : function(action) {
					grid.reload();
							}
						});
					}
      //打开详情子页
		function detail(bookid) {
			mini.open({
				url : bootPATH+ "../pages/bookinfo/bookinfodetail.html",
				title : "图书详情",
				width : 600,
				height : 400,
				onload : function() {
					var iframe = this.getIFrameEl();
					var data = {bookid : bookid};
				iframe.contentWindow.SetData(data);
				},
				ondestroy : function(action) {
					grid.reload();
							}
						});
					}
      //多行删除（以及单行）
      function remove(){
    	  var rows = grid.getSelecteds();
    	  if (rows.length > 0) {
    		  mini.confirm("确定删除选中记录？","提示信息",function(action){
    			  if(action=="ok"){
    				var ids = [];
					for (var i = 0, l = rows.length; i < l; i++) {
						var r = rows[i];
						ids.push(r.bookid);
						}
					var bookids = ids.join(",");
					grid.loading("操作中，请稍后......");
					$.ajax({
						url : "/bookinfolistaction?method=deleteBookInfo&bookids="+ bookids,
						success : function(text) {
						 mini.alert(text);
						grid.reload();},
						error : function() {}
					});
    			  }
    		  });
    	  }else{
    		  mini.alert("请选中一条记录");
    	  }
      }
      //传入查询条件
      function search() {
			var bookName = mini.get("bookName").getValue();
			var bookType = mini.get("bookType").getValue();
			grid.load({
				bookName : bookName,
				bookType:bookType
			});
		}
      //清除传入查询条件
      function clear() {
			var bookName = mini.get("bookName").setValue("");
			var bookType = mini.get("bookType").setValue("");
			//传入空值
			grid.load({
			});
		}
      //借阅
      function borr(bookid,remain){
    	  mini.open({
              url: bootPATH + "../pages/borrowinfo/borrowinfoadd.html",
              title: "新增借阅", width: 600, height: 400,
              onload: function () {
                  var iframe = this.getIFrameEl();
                  var data = { bookid: bookid,action:"AddBorrInBook",remain:remain};
                  iframe.contentWindow.SetData(data);
              },
              ondestroy: function (action) {

                  grid.reload();
              }
          });
      }
	</script>

</body>
</html>